import { ref } from 'vue'
export const Photo = () => {
    const form = ref<any>([])
    const photo = ref<any>([]) //图片文件夹
    const url = ref('') //上传图片的地址
    const fileId = ref(0) //点击的Tree文件夹id
    const newPath = ref<string>('')
    const uploadShow = ref(false)

    // 上传图片
    const selectFiles = async (file:any) => {
        form.value.push(file.raw)
        console.log('测试', file.raw)
        console.log('测1tggg', newPath.value);

        const paramsD = {
            file: file.raw,
            filepath: newPath.value
        }
        const a = await d2jsApi('post', '/uploadimg', paramsD)
        console.log('请求新闻列表', a)
        url.value = a.data[0]
        photo.value.push({ url: url.value })
        findNodeById(data.value, fileId.value, photo.value)
    }

    const defaultProps = {
        children: 'children',
        label: 'label',
    }

    // 树状结构
    const data = ref([
        {
            id: 1,
            label: '文件夹1',
            children: [
                {
                    id: 4,
                    label: '文件夹2',
                    children: [
                        {
                            id: 9,
                            label: '文件夹3',
                            images: [
                                { url: 'http://www.cyrsum.com/assets/banner-214279da.png' },
                                { url: 'http://www.cyrsum.com/assets/banner-214279da.png' },
                                { url: 'http://www.cyrsum.com/assets/banner-214279da.png' },
                            ],
                        },
                        {
                            id: 10,
                            label: '文件夹4',
                            images: [
                                {
                                    url: 'http://www.cyrsum.com/assets/%E4%BC%81%E4%B8%9A%E9%A3%8E%E9%87%871-265d0e2a.png',
                                },
                                {
                                    url: 'http://www.cyrsum.com/assets/%E4%BC%81%E4%B8%9A%E9%A3%8E%E9%87%871-265d0e2a.png',
                                },
                                {
                                    url: 'http://www.cyrsum.com/assets/%E4%BC%81%E4%B8%9A%E9%A3%8E%E9%87%871-265d0e2a.png',
                                },
                                {
                                    url: 'http://www.cyrsum.com/assets/%E4%BC%81%E4%B8%9A%E9%A3%8E%E9%87%871-265d0e2a.png',
                                },
                            ],
                        },
                    ],
                },
            ],
        },
        {
            id: 2,
            label: '文件夹5',
            children: [
                {
                    id: 5,
                    label: '文件夹6',
                    images: [
                        { url: 'http://www.cyrsum.com:8899/cyrweb/upload/1694161611552photo1.png' },
                        { url: 'http://www.cyrsum.com:8899/cyrweb/upload/1694161611552photo1.png' },
                        { url: 'http://www.cyrsum.com:8899/cyrweb/upload/1694161611552photo1.png' },
                        { url: 'http://www.cyrsum.com:8899/cyrweb/upload/1694161611552photo1.png' },
                        { url: 'http://www.cyrsum.com:8899/cyrweb/upload/1694161611552photo1.png' },
                    ],
                },
                {
                    id: 6,
                    label: '文件夹7',
                    images: [],
                },
            ],
        },
        {
            id: 3,
            label: '文件夹8',
            children: [
                {
                    id: 7,
                    label: '文件夹9',
                    images: [],
                },
                {
                    id: 8,
                    label: '文件夹10',
                    images: [],
                },
            ],
        },
    ])
    // 将添加的图片放入Tree
    const findNodeById = async (nodes:any, targetId:number, photoList:any): Promise<any> => {
        for (const node of nodes) {
            if (node.id === targetId) {
                node.images = photoList
                console.log('123456', data.value)

                const paramsD = {}
                paramsD._m = ''
                paramsD.params = JSON.stringify({ ...data.value })
                console.log('测试', paramsD)
                const m = await d2jsApi('post', '/getJson', paramsD)
                console.log('请求新闻列表', m.data)
                console.log('Tree', data.value)
                return node
            }
            if (node.children) {
                const foundNode = findNodeById(node.children, targetId, photoList)
                if (foundNode) {
                    return foundNode
                }
            }
        }
        return null
    }


    // 存入图片上传的文件夹级别
    function findById(nodes:any, targetId:number, currentPath = ''): Promise<any | null> {
        for (const node of nodes) {
            const newPath = currentPath === '' ? node.label : `${currentPath}/${node.label}`
            if (node.id === targetId) {
                return newPath
            }
            if (node.children) {
                const result = findById(node.children, targetId, newPath)
                if (result) {
                    return result
                }
            }
        }
        return null
    }


    // Tree文件夹点击事件
    const treeClick = async (x:any) => {
        fileId.value = x.id
        photo.value = x.images
        console.log('sdsadad', x.children)
        if (x.images) {
            uploadShow.value = true
        } else {
            uploadShow.value = false
        }
        console.log('文件ID', fileId.value)
        console.log('文件图片', photo.value)
        newPath.value = ''
        const bn = findById(data.value, fileId.value)
        console.log('iugiiyu', bn)
        newPath.value = bn as any
    }
    return { data, defaultProps, photo, uploadShow,  treeClick, selectFiles }
}
